The interactive web is built on JavaScript, from interactive bar charts like the one below (move your cursor over the barchart) to the interactive maps provided by Google, Bing and other services. There is a relatively simple way to build these interactive charts directly from R and to host these online via RPubs, GitHub Pages or to include such interactive data visualisations within a Shiny app. Note that the specific code for this interactive chart is documented at http://ox-it.github.io/LiveData_htmlwidgets/charts/BarCharts.
In order to generate these charts, R must generate the requisite HTML and JavaScript code for the visualisations. The RStudio company has made this process easy by developing a library called htmlwidgets which acts as a framework for building JavaScript bindings - which simply means:
htmlwidgets provides standardised tools to build secondary R packages that bind to JavaScript libraries, the functions in these R packages can be used to generate the same output the original JavaScript library would
A popular visualisation library used in this tutorial is plot.ly, the developers for plot.ly have created a library using htmlwidgets called plotly that allows interactive charts, maps and more to be generated directly from R code. Note that if you are following along with the code samples in this document you are advised to use RStudio which provides a built-in web viewer within which visualisations can be seen.
The code below generates an interactive scatterplot using the plotly.js library:
library(plotly)
library(gapminder)
plot_ly(data = gapminder,
x = gapminder$year,
y = gapminder$lifeExp,
group = gapminder$continent,
text = gapminder$country,
mode = "markers")
There are over 15 CRAN-hosted libraries that utilise htmlwidgets for creating interactive content, the majority of these libraries are well documented at htmlwidgets.org. The documentation at htmlwidgets.org is focused on individual libraries, it does not attempt to group them or compare the utility of the different libraries for specific types of charts.
This collection of guides attempts to address the following questions:
Note that these guides were produced for the Live Data Project run by Oxford University and do not aim to cover all htmlwidgets, in the first place only those libraries used in case studies are covered. However, futurue contributions are welcome.
A thorough comparison of the chart types and htmlwidget libraries available is provided here in addition to a number of interactive elements to assist in tool selection.
The following chart templates are currently provided:
Chart templates are organised in this repository as follows:
chartType
---------| index.html
---------| shiny_Folder
-----------------------| ui.R
-----------------------| server.R
The index.html file contains a very basic description of the chartType discussed in the templates, and instructions on how to construct the chartType with a variety of different libraries (where possible). This file can be viewed at the following address:
http://ox-it.github.io/LiveData_htmlwidgets/chartType
Where multiple libraries are capable of making comparable visualisations, a shiny app is provided to compare these at the following address:
https://livedataoxford.shinyapps.io/htmlwidget_template_chartType/